<div id="login-body">
  <div [style.height]="formType === 1 ? '20%' : '10%'"></div>
  <div id="login-logo"></div>
  <div id="login-content" *ngIf="formType === 1">
    <div id="login-form">
      <form nz-form [formGroup]="loginValidateForm" class="login-form" (ngSubmit)="loginForm()">
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="username">登录账号</nz-form-label>
          <nz-form-control nzErrorTip="请输入您的账户!">
            <input type="text" class="login-input" nz-input formControlName="username" placeholder="手机号码/电子邮箱" />
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="password">登录密码</nz-form-label>
          <nz-form-control nzErrorTip="请输入您的密码!">
            <input type="password" class="login-input" nz-input formControlName="password" placeholder="密码4-20数字或英文" />
          </nz-form-control>
        </nz-form-item>
      </form>
      <div id="link">
        <div class="link-item">
          <button nz-button (click)="changeForm(2)" class="text-button" nzType="text">注册账号</button>
        </div>
        <div class="link-item">
          <button nz-button (click)="changeForm(3)" nzType="text" class="text-button">忘记密码</button>
        </div>
      </div>
    </div>
    <div class="submit-button">
      <button nz-button (click)="loginForm()" nzType="primary">登录</button>
    </div>
    <div class="submit-checkbox">
      <label nz-checkbox [(ngModel)]="remember">记住密码</label>
    </div>
  </div>
  <div id="registe-content" *ngIf="formType === 2">
    <div id="registe-form">
      <form nz-form [formGroup]="registerValidateForm" class="registe-form">
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="email">电子邮箱</nz-form-label>
          <nz-form-control [nzErrorTip]="emailErrorTpl">
            <input type="text" nz-input formControlName="email" placeholder="电子邮箱" />
            <ng-template #emailErrorTpl let-control>
              <ng-container *ngIf="control.hasError('email')">
                电子邮箱输入错误
              </ng-container>
              <ng-container *ngIf="control.hasError('required')">
                请输入电子邮箱
              </ng-container>
              <ng-container *ngIf="control.hasError('exists')">
                此电子邮箱已被注册
              </ng-container>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="password">账户密码</nz-form-label>
          <nz-form-control nzErrorTip="请输入您的密码!">
            <input type="password" nz-input formControlName="password" placeholder="密码4-20数字或英文" />
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="phone">手机号码</nz-form-label>
          <nz-form-control [nzErrorTip]="phoneErrorTpl!">
            <input type="text" nz-input formControlName="phone" placeholder="请输入手机号码" />
            <ng-template #phoneErrorTpl let-control>
              <ng-container *ngIf="control.hasError('pattern')">
                手机号码输入错误
              </ng-container>
              <ng-container *ngIf="control.hasError('required')">
                请输入手机号码
              </ng-container>
              <ng-container *ngIf="control.hasError('exists')">
                此手机号码已被注册
              </ng-container>
            </ng-template>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="code">验证码</nz-form-label>
          <nz-form-control style="position: relative;" nzErrorTip="验证码输入错误!">
            <input type="text" nz-input formControlName="code" placeholder="请输入验证码" />
            <button class="verify-code" [disabled]="codeButtonDisabled" nz-button [nzType]="'default'"
              (click)="sendCode()">{{codeButtonText}}</button>
          </nz-form-control>
        </nz-form-item>
      </form>
    </div>
    <div class="submit-button">
      <button style="margin-right: 20px;" nz-button (click)="changeForm(1)" nzType="primary">返回</button>
      <button nz-button (click)="registerForm()" nzType="primary">注册</button>
    </div>
    <div class="submit-checkbox">
      <label nz-checkbox [(ngModel)]="agreement"></label>
      <a (click)="showAgreement()">已阅读并同意《用户使用协议》和《隐私协议》</a>
    </div>
  </div>
  <div id="find-password-content" *ngIf="formType === 3">
    <div id="find-password-form">
      <form nz-form [formGroup]="passwordValidateForm" class="find-password-form">
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="userName">登录账号</nz-form-label>
          <nz-form-control nzErrorTip="请输登录账号">
            <input type="text" nz-input formControlName="userName" placeholder="登录账号" />
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="code">验证码</nz-form-label>
          <nz-form-control style="position: relative;" nzErrorTip="验证码输入错误!">
            <input type="text" nz-input formControlName="code" placeholder="请输入验证码" />
            <button class="verify-code" [disabled]="codeButtonDisabled" nz-button [nzType]="'default'"
              (click)="sendCode2()">{{codeButtonText}}</button>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-label [nzSm]="24" [nzXs]="24" nzFor="password">账户新密码</nz-form-label>
          <nz-form-control nzErrorTip="请输入您的新密码!">
            <input type="password" nz-input formControlName="password" placeholder="密码4-20数字或英文" />
          </nz-form-control>
        </nz-form-item>
      </form>
    </div>
    <div class="submit-button">
      <button style="margin-right: 20px;" nz-button (click)="changeForm(1)" nzType="primary">返回</button>
      <button nz-button (click)="passwordForm()" nzType="primary">提交</button>
    </div>
  </div>
</div>
<nz-modal nzWrapClassName="vertical-center-modal" [(nzVisible)]="isShowAgreement" (nzOnCancel)="closeAgreement()"
  [nzMaskClosable]="false" nzWidth="800" [nzTitle]="'《用户使用协议》和《隐私协议》'" [nzFooter]="null">
  <div class="areement" [style.max-height]="maxHeight">
    <h3>导言</h3>
    <p>
      为了使用云视界VR直播平台网站（以下简称“本平台”），您应当阅读并遵守《云视界VR直播用户协议》（以下简称“本协议”）和《云视界VR直播隐私政策》的全部条款。请你务必审慎阅读、充分理解各条款内容，特别是免除或者限制责任的条款，以及开通或使用某项服务的单独协议，并选择接受或不接受。限制、免责条款可能以加粗形式提示你注意。如您不同意本协议或《云视界VR直播隐私政策》中的任一条款或本平台对其进行的修改，请勿使用本平台。您一旦使用本平台提供的服务，包括但不限于浏览平台信息、下载平台内容、注册、使用平台提供的第三方链接等，即视为您已阅读、理解并完全同意受本协议和《云视界VR隐私政策》中的所有条款的约束。登录平台之后您可在个人中心->设置模块找到本协议和《云视界VR隐私政策》进行回看。
    </p>
    <h4>1.服务说明</h4>
    <div>
      1.1云视界VR平台向用户提供的产品与/或服务，包含但不限于：<br />
      1.1.1云视界VR平台直接拥有或运营的平台包括但不限于手机、头戴一体机设备等全部终端平台产品（也称“云视界VR平台”）。<br />
      1.2本协议适用于本平台的所有产品与/或服务，包括但不限于软件、网站、服务以及包含的相关产品或服务功能，用户终端包括但不限于移动终端、VR终端。<br />
      1.3本平台的产品与/或服务，均仅限于用户在本平台的平台使用，任何以恶意破解等非法手段将本平台的产品与/或服务与本平台的平台分离的行为，均不属于本协议中约定的本平台的产品与服务。由此引起的一切法律后果由行为人负责，本平台将依法追究行为人的法律责任。<br />
      1.4本平台官方公布的方式为搜索、浏览、注册、登录、使用本平台服务的唯一合法方式，用户通过其他任何未经过本平台合法授权的渠道、任何途径、任何方式获取的本平台的产品与服务（包括且不限于账号、社区商品、等服务）均为非法取得，本平台概不承认其效力，且一经发现本平台有权立即做出删除、取消、清零、封号等处理，任何因此导致的一切不利后果均由用户自行承担。<br />
      1.5本平台有权提前向用户公告（包括但不限于弹出页面公告）以修改、替换、升级与本平台提供的任何产品与/或服务和/或上述产品与/或服务相关的任何软件。如果用户不同意本平台提供的任何产品与/或服务和/或上述产品与/或服务相关软件的修改、替换、升级，请直接拒绝、停止、取消，否则视为用户同意本平台提供的任何产品与/或服务和/或上述相关软件的修改、替代、升级，同时前述修改、替换、升级不影响本协议的效力。<br />
    </div>
    <h4>2.服务使用规则</h4>
    <div>
      2.1用户在申请注册使用本平台产品与/或服务时，必须向本平台提供完整、真实、准确、合法、有效、最新的个人资料。如果上述信息发生变化，用户应及时更改。并保证上述资料系用户本人的真实资料，不得冒用他人身份或使用他人手机号码等注册本平台账号。如果因注册信息不真实或更新不及时或冒用行为等导致的账号纠纷或引发的相关问题，本平台不负任何责任。同时，本平台有权选择根据实际情况暂时或永久封停此账号。<br />
      2.2用户仅可自行在本平台的官方渠道注册成为本平台注册用户。任何通过其他非本平台官方途径获得的账号信息（包括但不限于购买、租用、借用、分享等方式获得的账号信息，以及恶意利用或破坏本平台注册系统获得的注册账号），本平台不保证其合法性和正常使用性，由此导致账号被封停、注销或收回的，用户自行承担全部责任。<br />
      2.3用户应当通过真实身份信息认证注册账号，且用户提交的注册信息中不得出现违法和不良信息，本平台有权对上述信息及用户的真实身份予以审查，如存在上述情况，本平台有权不予注册。已经注册的，如发现用户以虚假信息骗取账号注册，或其账号昵称等注册信息存在违法和不良信息的，本平台有权不经通知单方采取限期改正、清除、临时封停、永久封停、注销登记、收回等措施。<br />
      2.4用户不得通过任何手段恶意注册本平台账号（包括但不限于使用无效手机号、使用他人身份等恶意注册）或利用本平台账号进行违法活动、捣乱、骚扰、欺骗其他用户以及其他违反本协议的行为，本平台有权对上述账号永久封停、注销登记、收回等措施，由此造成损失，由用户自行承担。同时，本平台有权将上述行为移交有权部门处理。<br />
      2.5本平台账号所有权归本平台所有，用户仅拥有本平台账号的有限使用权。用户需对其享有使用权的账号下所从事的所有行为承担责任，用户应妥善保管自己的账号、密码，不得将本平台账号转让、出信、出租、售卖或分享予他人使用。否则本平台有权选择根据实际情况暂时或永久封停此账号，当用户的账号或密码遭到未经授权的使用时，用户应当立即通知本平台，否则未经授权的使用行为均视为用户本人的行为。本平台为了保障用户的账号安全可能会定期或不定期采用不同的方式对用户的身份进行验证，包括但不限于要求输入验证码、短消息验证等。如用户无法完成验证或拒绝验证的，本平台可合理怀疑用户的账号出现异常或被盗，并暂停向用户提供产品与/或服务及/或采取进一步措施。<br />
      2.6因非本平台原因导致的用户账号信息遗失，用户如需找回的，需按照本平台官方公布的账号找回流程的要求提供相应的信息和证明；并确保提供的信息和证明文件的合法真实有效，若提供的材料不真实或不符合要求，无法通过本平台账号的安全验证，可能会导致账号找回失败，相应的风险和损失用户自行承担。<br />
      2.7用户知悉并同意，受限于宽带和网络连接问题，本平台在提供产品与服务的过程中可能会出现需较长时间缓冲或卡顿或其他类似的情况，此类情况并非本平台过错，本平台无需就此类情况向用户承担责任。且为了减少甚至避免上述情况的出现，从而进一步提升用户的服务体验，用户确认本平台可采取一系列技术手段对产品和服务进行优化，包括改进本平台CDN节点分布调度、使用本平台专有CDN对等网络等提升视频分发质量的技术措施等。<br />
      2.8用户知悉并同意，本平台提供的产品与服务需接入互联网方可使用，因此用户需自行承担使用产品与服务过程中所产生的上行和下行的网络通信及流量费用，上述费用将由网络运营商收取。<br />
      2.9用户在使用本平台的产品与/或服务过程中，应遵守宪法法律，包括但不限于《中华人民共和国保守国家秘密法》、《中华人民共和国著作权法》、《中华人民共和国计算机信息系统安全保护条例》、《计算机软件保护条例》、《互联网电子公告服务管理规定》、《信息网络传播权保护条例》、《网络安全法》等有关计算机及互联网规定的法律、法规；应遵守公共秩序，尊重社会公德，不得危害网络安全，不得利用网络从事危害国家安全、荣誉和利益，候动颠覆国家政权、推翻社会主义制度，煽动分裂国家、破坏国家统一，宣扬恐怖主义、极端主义，宣扬民族仇恨、民族歧视，传播暴力、淫秽色倩信息，编造、传播虚假信息扰乱经济秩序和社会秩序，以及侵害他人名誉、隐私、知识产权和其他合法权益等活动。在任何倩况下，本平台一旦合理地认为用户存在上述行为的，可以在任何时候，不经事先通知终止向该用户提供产品与/或服务。<br />
    </div>
    <h4>3.用户个人信息保护</h4>
    <div>
      3.1个人信息的收集您在匿名状态下即可访问本平台并获取信息。<br />
      在请求您提供有关信息前，本平台会解释这些信息的用途。本平台仅在与经营活动有关的合法目的下，经本人同意，以合法的方式收集必费的个人信息。除上述方式收集到的信息，本平台还会收集和处理以下信息：IMEI、MAC、IP地址。<br />
      3.2个人信息的使用本公司可能基于保障和提升产品或服务、更好地提供服务、开展自有营销及内部数据分析等目的自行使用您的相关信息。本公司承诺遵守法律规定使用该等信息，您在此知悉并同意本公司对该等信息的使用。<br />
      除非获得您的同意，或者遵守法律和监管要求的前提下，或者为满足您的使用要求、丰富服务之需，本公司不向任何第三方出售或以其他方式披露所收集信息。<br />
      3.3您注册成为本平台用户时和注册后，本公司将依据法律规定和注册服务协议约定收集和使用相关用户信息。。<br />
    </div>
    <h4>4.知识产权</h4>
    <div>
      4.1本公司拥有本平台的著作权、商标权以及其他相关的知识产权，包括但不限于各种文档资料、软件、商标、FLASH、设计、图案、音像、提影、动画、美术等。<br />
      4.2本公司拥有本平台平台内的所有技术、软件、程序、数据（包括但不限于文字、图像、图片、照片、音频、视频、图表、色彩、版面设计、电子文档）的所有知识产权（包括但不限于版权、商标权、专利权、商业秘密等）及相关权利。<br />
      4.3除法律另有规定或本公司书面同意外，您不得以商业目的对本公司和本平台拥有权利的上述信息或内容进行修改、复制、分发、传送、显示、公布、许可、转让或基于以上内容创建衍生作品的使用。如果您违反法律规定或损害本平台和本公司的利益，本公司保留采取相关法律措施的权利。<br />
      4.4本平台内的商品和服务（统称“商品”）的信息（包括但不限于商品的描述和说明、相关图片、视频等）均由相关厂商、零售商或者通过本平台平台销售商品之主体提供：提供方依法对所捉供信息的真实性、合法性、完整性、有效性承担全部法律责任。本公司尊重知识产权，反对侵权、虚假宣传等一切违法行为。如汉利人认为该等内容（包括但不限于第三方商户发布的商品信息）可能涉嫌侵犯其合法权益，可以向本公司提出书面通知，本公司将依法及时处理。<br />
    </div>
    <h4>5.第三方链接</h4>
    <div>
      5.1本平台对第三方的链接本平台可能包含一些对第三方经营的平台或网站、应用、软件（简称“第三方产品”》的链接或指引服务，对第三方产品的链接仅为供您方使之用。本公司保留在任何时间终止对第三方产品链接的权利。<br />
      本平台所链接的第三方产品的内容及其描述或提供的产品与服务本公司无法控制，强烈建议您使用第三方信息前审慎判断其真实性、可靠性。本公司对第三方产品（包括对其他方的进一步链接）负不完全责任。您一旦决定登陆或使用所链按的第三方产品应注意可能会受到适用于该第三方的条款和条件的限制，同时自行采取预防措施以便在登陆或使用第三方产品时避免病毒或其他破坏性囚素。对于登陆或使用所链接第三方产品所产生的任何损失，本公司仅承担部分法律责任并根据需会依法提供必些的协助。<br />
      5.2第三方对本平台的链接第三方对本平台的链按，并不表示本公司对第三方作出了某种认可、授权，也不表明其属于本公司的关联企业、合作方或业务伙伴。<br />
      任何第三方设立对本平台的链接，均应当丰先取得本公司的书面同意，并必须遵守本平台的如下政策：<br />
      （1）链接的外观、位置及其他设置不得以任何形式损害或贬损本公司的名称、注册标志及声誉；<br />
      （2）链接的外观、位置及其他特性不得蓄意制造假象，使浏览者误认为第三方平台或其经营者是本公司的关联企业、合作方或业务伙伴；<br />
      （3）本公司保留随时我消涉及本平台链接的权利。<br />
    </div>
    <h4>6.免责声明</h4>
    <div>
      6.1本平台发布的内容可能没有包含与本公司及其业务有关的最新信息。对本平台所发布的内容的准确性、有效性、及时性或完整性，本公司不提供任何明示或默示的担保或保证。<br />
      6.2本平台不以任何方式就内容传递或传送的失误、不准确或错误向您或任何其他人士承担直接或间接的责任。在法律允许的范围内，本平台不承担您或任何人士就使用或未能使用本平台内容或任何链接所引致的直接、间接、附带、从属、特殊、惩罚性或惩戒性的损害赔偿（包括但不限于收益、预期利润的损失或失去的业务、未实现预期的节省）和责任。<br />
      6.3本平台所出售的商品均遵守国家相关规定。<br />
      请关注本平台不时发布的信息、公告、通知以了解相关要求和限制。<br />
      6.4您在任何地区使用或分发本平台内容，应同时遵守当地法律及监管要求。<br />
    </div>
    <h4> 7.服务变更、中断或终止</h4>
    <div>
      7.1如因系统维护或升级的需要而需暂停本平台服务，本公司将尽可能事先进行通告；<br />
      7.2如发生下列任何一种情形，本平台有权随时中断或终止提供平台服务而无需通知，并拒绝您于现在和未来使用本平台所提供服务之全部或任何部分：<br />
      （1）您提供任何错误、不实、过时或不完整或具误导性的资料，或者本平台有理由怀疑前述资料为错误、不实、过时或不完整或具误导性的；<br />
      （2）您违反本协议的规定。<br />
      7.3除前款所述情形外，本平台同时保留在不事先通知的情况下随时中断或终止部分或全部平台服务的权利，对于所有服务的中断或终止而造成的任何损失，本平台及本公司无需对您或任何第三方承担任何责任。<br />
    </div>
    <h4>8.信息内容规范</h4>
    <div>
      8.1本条所述信息内容是指用户使用本软件及服务过程中所制作、复制、发布、传播的任何内容，包括但不限于本平台帐号或功能帐号的头像、名字、用户说明、简介等注册信息，或发送的文字、语音、图片、视频、表情等信息、朋友圈图文、视频动态、视频号内容和相关链接页面，以及其他使用本平台帐号或功能账号或本软件及服务所产生的内容。<br />
      8.2你理解并同意，本平台一直致力于为用户提供文明健康、规范有序的网络环境，你不得利用本平台账号或功能帐号或本软件及服务制作、复制、发布、传播如下干扰本平台正常运营，以及侵犯其他用户或第三方合法权益的内容，包括但不限于：<br />
      8.2.1发布、传送、传播、储存违反国家法律法规禁止的内容：<br />
      （1）违反宪法确定的基本原则的；<br />
      （2）危害国家安全，泄露国家秘密，颠覆国家政权，破坏国家统一的；<br />
      （3）损害国家荣誉和利益的；<br />
      （4）煽动民族仇恨、民族歧视，破坏民族团结的；<br />
      （5）破坏国家宗教政策，宣扬邪教和封建迷信的；<br />
      （6）散布谣言，扰乱社会秩序，破坏社会稳定的；<br />
      （7）散布淫秽、色情、赌博、暴力、恐怖或者教唆犯罪的；<br />
      （8）侮辱或者诽谤他人，侵害他人合法权益的；<br />
      （9）煽动非法集会、结社、游行、示威、聚众扰乱社会秩序；<br />
      （10）以非法民间组织名义活动的；<br />
      （11）遵守法律法规、社会主义制度、国家利益、公民合法利益、公共秩序、社会道德风尚和信息真实性等“七条底线”要求的；<br />
      （12）含有法律、行政法规禁止的其他内容的。<br />
      8.2.2发布、传送、传播、储存侵害他人名誉权、肖像权、知识产权、商业秘密等合法权利的内容；<br />
      8.2.3涉及他人隐私、个人信息或资料的；<br />
      8.2.4发表、传送、传播骚扰、广告信息、过度营销信息及垃圾信息或含有任何性或性暗示的；<br />
      8.2.5其他违反法律法规、政策及公序良俗、社会公德或干扰本平台正常运营和侵犯其他用户或第三方合法权益内容的信息。<br />
    </div>
    <h4> 9.协议修改</h4>
    <div>
      9.1本公司有权在任何时间自行修改和增、册（统称“修改”）本协议。<br />
      9.2修改后的声明将张贴于本平台，您继续访问或使用本平台，则视为接受这些修改。如果不同意本平台对本协议的修改，您有权停止使用本平台服务。<br />
    </div>
    <h4>10.法律适用</h4>
    <div>
      本协议的订立、解释、履行及争议的解决均应适用中华人民共和国法律。因使用本平台所产生的争议，应先协商解决，协商不成的，本公司和用户一致同意接受贵州云视界科技有限公司所在地有管辖权的人民法院进行管辖。
    </div>
  </div>
</nz-modal>

<a class="copyright" href="https://beian.miit.gov.cn" target="_blank">黔ICP备19006233号-2</a>